<div>
    <div class="row">
        <div class="col-md-2">
            <utk-button btn-text="{{btn.text}}" btn-icon="{{btn.icon}}" btn-size="{{btn.size}}" btn-type="{{btn.type}}" btn-disabled="{{btn.disabled}}"></utk-button>
        </div>
        <div class="col-md-8">
            <table class="table">
                <thead>
                    <tr>
                        <th>Property</th>
                        <th>Value</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Text:</td>
                        <td><input type="text" ng-model="btn.text"/></td>
                    </tr>
                    <tr>
                        <td>Enable:</td>
                        <td><utk-checkbox chk-text="Disable" ng-model="btn.disabled"></utk-checkbox></td>
                    </tr>
                    <tr>
                        <td>Style:</td>
                        <td><utk-dropdown dp-items="types" ng-model="btn.type" dp-width="160px"></utk-dropdown></td>
                    </tr>
                    <tr>
                        <td>Icon: 
                            <utk-tooltip tip-text="Check bootstrap glyphicon">
                                <a><em>(more icons?)</em></a>
                            </utk-tooltip>
                        </td>
                        <td><utk-dropdown dp-items="icons" ng-model="btn.icon" dp-width="160px"></utk-dropdown></td>
                    </tr>
                    <tr>
                        <td>Size:</td>
                        <td>
                            <utk-radiogroup ng-model="btn.size">
                                <utk-radiobutton rb-text="large" rb-value="large"></utk-radiobutton>
                                <utk-radiobutton rb-text="normal" rb-value="normal"></utk-radiobutton>
                                <utk-radiobutton rb-text="small" rb-value="small"></utk-radiobutton>
                                <utk-radiobutton rb-text="xsmall" rb-value="xsmall"></utk-radiobutton>
                            </utk-radiogroup>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <h3>Syntax:</h3>
    <utk-code cd-lang="markup" class="selectable">&lt;div utk-button btn-text="{{btn.text}}"
    btn-icon="{{btn.icon}}"
    btn-type="{{btn.type}}"
    btn-size="{{btn.size}}"
    btn-disabled="{{btn.disabled}}"&gt;
&lt;/div&gt;</utk-code>
</div>
